{% extends 'base/base.html' %}
{% load i18n %}

{% block title %}注册 - 妙趣拾光锦盒{% endblock %}

{% block content %}
<section class="py-5">
  <div class="container">
    <div class="row justify-content-center">
      <div class="col-md-6">
        <div class="card shadow">
          <div class="card-body p-5">
            <h2 class="card-title text-center mb-4">用户注册</h2>
            
            <form class="signup" id="signup_form" method="post" action="{% url 'account_signup' %}">
              {% csrf_token %}
              
              {% if form.errors %}
              <div class="alert alert-danger">
                {% for field in form %}
                  {% for error in field.errors %}
                    <p>{{ error }}</p>
                  {% endfor %}
                {% endfor %}
                
                {% for error in form.non_field_errors %}
                  <p>{{ error }}</p>
                {% endfor %}
              </div>
              {% endif %}
              
              {% if redirect_field_value %}
              <input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
              {% endif %}
              
              <div class="mb-3">
                <label for="id_username" class="form-label">用户名：</label>
                <input type="text" name="username" placeholder="请输入用户名" class="form-control" autocomplete="username" required id="id_username">
                <div class="form-text">用户名将作为您登录和在网站上的显示名称</div>
              </div>
              
              <div class="mb-3">
                <label for="id_email" class="form-label">电子邮件：(可选)</label>
                <input type="email" name="email" placeholder="您的邮箱地址" class="form-control" autocomplete="email" id="id_email">
                <div class="form-text">用于找回密码和接收通知</div>
              </div>
              
              <div class="mb-3">
                <label for="id_password1" class="form-label">密码：</label>
                <input type="password" name="password1" placeholder="设置密码" class="form-control" autocomplete="new-password" required id="id_password1">
              </div>
              
              <div class="mb-3">
                <label for="id_password2" class="form-label">确认密码：</label>
                <input type="password" name="password2" placeholder="再次输入密码" class="form-control" autocomplete="new-password" required id="id_password2">
                <div class="form-text">为了验证，请再次输入密码</div>
              </div>
              
              <div class="mb-3 form-check">
                <input type="checkbox" name="terms" class="form-check-input" id="id_terms" required>
                <label class="form-check-label" for="id_terms">我已阅读并同意<a href="../../help/terms"
                                                                                class="text-decoration-none">服务条款</a>
                  和<a href="../../help/privacy" class="text-decoration-none">隐私政策</a></label>
              </div>
              
              <div class="d-grid gap-2">
                <button class="btn btn-primary" type="submit">注册</button>
              </div>
            </form>
            
            <div class="text-center mt-4">
              <p>已有账号? <a href="{% url 'account_login' %}" class="text-decoration-none">登录</a></p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
{% endblock %} 